<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <!-- header -->
    <%@ include file="/WEB-INF/views/include/header.jsp" %>
    <link rel="stylesheet" href="<s:url value=" /assets/dist/css/bootstrap.css "></s:url>"/>
    <link rel="stylesheet" href="<s:url value=" /assets/dist/css/Reset.css "></s:url>"/>
    <%--本页面css--%>
    <link rel="stylesheet" href="<s:url value=" /assets/dist/css/index/index.css "></s:url>"/>
    <%--模态框css--%>
    <link rel="stylesheet" href="<s:url value=" /assets/dist/css/modal.css "></s:url>"/>
    <%--分页css--%>
    <link rel="stylesheet" href="<s:url value=" /assets/dist/css/pager.css "></s:url>"/>
    <style>
        <%--修改模态框样式--%>
        .modal-content {
            border-radius: 0;
            box-shadow: 0 -2px 15px rgba(0, 0, 0, .5);
        }

        .modal-content h4 {
            font-size: 18px;
        }

        /*按钮样式*/
        .sel-course {
            padding: 6px 25px;
            background: rgba(86, 169, 216, 1);
            border: 0;
            border-radius: 10px;
            color: #fff;
        }

        .sel-red {
            display: inline-block;
            padding: 5px 20px;
            background-color: #FF4653;
            color: #fff;
        }

        /*<span class="span sel-red">选修</span>*/
    </style>
</head>
<body class="no-skin">
<!-- /section:basics/navbar.layout -->
<div class="main-container" id="main-container" style="background-color: #F7F7F7;">
    <script type="text/javascript">
        try {
            ace.settings.check('main-container', 'fixed')
        } catch (e) {
        }
    </script>

    <!-- /section:basics/sidebar -->
    <div class="main-content">
        <div class="main-content-inner">
            <div class="page-content">
                <!-- /section:settings.box -->
                <div class="row no-margin  mian-course" style="margin-bottom: 20px !important;">
                    <!-- 头部信息 -->
                    <div class="col-xs-12">
                        <div class="header-info clear">
                            <div class="header-title pull-left">第一轮选修课</div>
                            <%--<div class="header-time pull-left">2018.07.01-2018.08.01</div>
                            <div class="remaining-points pull-left">我的剩余投标点数:
                                <em id="aab999-kexuan">${aab999}</em>点
                            </div>
                            <select name="" class="pull-left" id="select-school">
                                <option value="01">当前选课校区：思明</option>
                                <option value="02">当前选课校区：翔安</option>
                            </select>--%>
                        </div>
                    </div>
                    <div class="col-xs-12">
                        <div class="tabs-button clear">
                            <ul class="nav nav-tabs">
                                <%--<li ><a href="#college-compulsory" data-toggle="tab">院系必修课</a></li>--%>
                                <%--<li><a href="#school-compulsory" data-toggle="tab">全校性必修课 </a></li>--%>
                                <%--<li><a href="#college-choose" data-toggle="tab">院系选修课</a></li>--%>
                                <li class=" active">
                                    <a href="#school-choose" data-toggle="tab">全校选修课</a>
                                </li>
                                <%--<li><a href="#public-course" data-toggle="tab">公共课</a></li>--%>
                                <%--<li><a href="#resets" data-toggle="tab">重修</a></li>--%>
                            </ul>
                        </div>
                    </div>
                    <div class="col-xs-12">
                        <div class="floor-box clear">
                            <div class="tab-content">
                                    <div class="searchs">
                                        <!-- 第一行 -->
                                        <div class="row">
                                            <div class="col-xs-2">
                                                开课院：
                                                <select name="" id="bab007">
                                                    <option value="">-请选择-</option>
                                                    <option value="软件学院">软件学院</option>
                                                    <option value="理学院">理学院</option>
                                                </select>
                                            </div>
                                            <div class="col-xs-2">
                                                开课系：
                                                <select name="" id="bab008">
                                                    <option value="">-请选择-</option>
                                                    <option value="计算机系">计算机系</option>
                                                    <option value="数学系">数学系</option>
                                                    <option value="	自动化系">	自动化系</option>
                                                </select>

                                            </div>
                                            <div class="col-xs-2">
                                                课程：
                                                <input id="bab002" type="text" placeholder="-输入-">
                                            </div>
                                            <div class="col-xs-2">
                                                教师：
                                                <input id="bab006"  type="text" placeholder="-请输入-">
                                            </div>

                                        </div>
                                        <!-- 第二行 -->
                                        <div class="row">
                                            <div class="col-xs-2">
                                                教室地点：
                                                <select name="" id="bab004" style="width:155px !important;">
                                                    <option value="">-请选择-</option>
                                                    <option value="嘉庚楼">嘉庚楼</option>
                                                    <option value="芙蓉楼">芙蓉楼</option>
                                                    <option value="南光楼">南光楼</option>
                                                    <option value="丰庭楼">丰庭楼</option>
                                                    <option value="成义楼">成义楼</option>
                                                    <option value="石井楼">石井楼</option>
                                                    <option value="凌云楼">凌云楼</option>
                                                    <option value="群贤楼">群贤楼</option>
                                                    <option value="逸夫楼">逸夫楼</option>
                                                </select>
                                            </div>
                                            <%--<div class="col-xs-2  slelect-width">--%>
                                                <%--节&nbsp;&nbsp;&nbsp;次：--%>
                                                <%--<select name="">--%>
                                                    <%--<option value="01">-请选择-</option>--%>
                                                    <%--<option value="01">选择一</option>--%>
                                                    <%--<option value="02">选择二</option>--%>
                                                <%--</select>--%>
                                                <%------%>
                                                <%--<select name="">--%>
                                                    <%--<option value="01">-请选择-</option>--%>
                                                    <%--<option value="01">选择一</option>--%>
                                                    <%--<option value="02">选择二</option>--%>
                                                <%--</select>--%>
                                            <%--</div>--%>
                                            <div class="col-xs-2">学分：
                                                <input id="bab009" style="width:183px;" type="text" placeholder="-输入-">
                                            </div>
                                        </div>
                                        <!-- 第三行  查询按钮 -->
                                        <div class="row query-area">
                                            <div class="col-xs-2">
                                                <button id="searchs-btn"  class="searchs-btn btn">
                                                    <span class="search glyphicon glyphicon-search"></span>&nbsp;&nbsp;&nbsp;查询
                                                </button>
                                            </div>
                                        </div>

                                        <%--<div class="row formater">--%>
                                            <%--<div class="col-xs-12">注意：红色框选修课程为各学院对外开放校选名额的专业课，欢迎感兴趣的同学选修。</div>--%>
                                        <%--</div>--%>
                                    </div>
                            </div>
                            <!-- tab 容器 -->
                        </div>
                        <!-- floor-box 容器 -->
                    </div>
                </div>
                <div class="row ">
                    <div class="col-xs-12">
                        <div class="pull-left" style="margin-left: 38px;color: rgba(245, 74, 89, 1);font-size: 16px;">* 双击列表可进行选课操作
                        </div>
                        <div class="pull-right">
                            <shiro:hasPermission name="modules:sys:dept:query">
                                <button class="btn btn-sm btn-info" id="query">查询</button>
                            </shiro:hasPermission>
                            <shiro:hasPermission name="modules:sys:dept:edit">
                                <button class="btn btn-sm btn-default" id="edit">修改</button>
                            </shiro:hasPermission>
                            <shiro:hasPermission name="modules:sys:dept:create">
                                <button class="btn btn-sm btn-success" id="create">新增</button>
                            </shiro:hasPermission>
                            <shiro:hasPermission name="modules:sys:dept:delete">
                                <button class="btn btn-sm btn-danger" id="delete">删除</button>
                            </shiro:hasPermission>
                            <shiro:hasPermission name="modules:sys:dept:excel">
                                <button class="btn btn-sm btn-pink" id="export">导出</button>
                            </shiro:hasPermission>
                        </div>
                    </div>
                </div>
                <div class="row no-margin" style="overflow-x:hidden;">
                    <div class="col-xs-12">
                        <!-- PAGE CONTENT BEGINS -->
                        <!-- jqGrid表格 -->
                        <table id="gridTable"></table>
                        <!-- jqGrid工具类 -->
                        <div id="gridPager"></div>
                        <!-- 查询对话框 -->
                        <div style="display: none;">
                            <div class="row" id="queryDialog"></div>
                        </div>
                        <!-- PAGE CONTENT ENDS -->
                    </div><!-- /.col -->
                </div><!-- /.row -->
            </div><!-- /.page-content -->
            <%--退课模态框--%>
        </div>
    </div><!-- /.main-content -->

    <a href="#" id="btn-scroll-up" class="btn-scroll-up btn btn-sm btn-inverse">
        <i class="ace-icon fa fa-angle-double-up icon-only bigger-110"></i>
    </a>

    <!-- dialog -->
    <%@ include file="/WEB-INF/views/include/dialog.jsp" %>
</div><!-- /.main-container -->
</div>
<!-- footer -->
<script src="<s:url value="/assets/dist/js/jquery.min.js"></s:url>"></script>
<%@ include file="/WEB-INF/views/include/footer.jsp" %>
<script src="<s:url value="/assets/dist/js/bootstrap.min.js"></s:url>"></script>
<script src="<s:url value="/assets/dist/js/pager.js"></s:url>"></script>


<script type="text/javascript">
    //基本路径
    var baseUrl = "<s:url value="/sys/course"></s:url>/"

    //jqgrid的表格高度
    var height = 320;
    //jqgrid表格行头的中文
    var colNames = ['', '课程类别', '课程性质', '课程名称', '名额', '班级', '开课系', '学分', '上课时间', '上课地点'];
    //jqgrid表格中每一行的信息模型
    var colModel = [
        {name: 'sysId', width: 60, hidden: true, key: true},
        {name: 'bab007', index: 'bab007', width: 60, editable: true},
        {name: 'bab010', index: 'bab010', width: 60, editable: true},
        {name: 'bab002', index: 'bab002', width: 60, editable: true},
        {name: 'bab003', index: 'bab003', width: 60, editable: true},
        {name: 'bab004', index: 'bab004', width: 60, editable: true},
        {name: 'bab008', index: 'bab008', width: 60, editable: true},
        {name: 'credits', index: 'credits', width: 60, editable: true},
        {name: 'bab005', index: 'bab005', width: 60, editable: true},
        {name: 'bab004', index: 'bab004', width: 60, editable: true}
    ];

    //jqgrid的具体执行方法
    jqgrid({
        gridTableId: "#gridTable",
        gridPagerId: "#gridPager",

    });

    /*//加载查询对话框
    $("#queryDialog").load(getUrl("filter"));*/

    //重置表单
    function reset() {
        resetForm("#formDialog form");
    }

    //选课按钮t
    function selectcourse(cellvalue, options, rowObject, state) {
        /* console.log("分割线");
         console.log(options);*/
        var imgeHtml = " <button class=\"sel-course\"  data-toggle=\"modal\" data-target=\"#myModal\"  onclick=\"myclick('" + options.rowId + "')\" >选课</button> ";

        return imgeHtml;
    }


    //保存数据
    function create() {
        executeSaveOrUpdate({
            formId: "#formDialog form",
            dialogId: "#formDialog",
            url: getUrl("edit"),
            tableId: "#gridTable",
            successMessage: "保存成功",
            successTitle: '保存对话框',
            failMessage: '保存失败',
            failTitle: '消息对话框'
        });
    }

    //显示编辑对话框
    function showEditView() {
        showEditDialog({
            tableId: "#gridTable",
            // dialogTitle: "更新对话框",
            dialogUrl: getUrl("edit"),
            dialogFoot: '<button type="button" class="btn btn-primary" onclick="edit()" id="updatebtn">确认</button>' +
            '<button id="return-course" class="btn btn-danger" onclick="backCourse()">退课</button>' +
            '<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>',
            errorTitle: "消息对话框",
            errorMutiSelectMessage: '您当前选中多行，请重新选择',
            errorUnSelectMessage: '您当前尚未选中一行，请选择后再试',
            errorOk: '确定'
        });
    }

    //双击
    $("#gridTable").dblclick(function (e) {
        // showView();

        console.log(e);
        showEditView();
    });

    /**判断是改变投注点数值
     * changeVlue()
     *
     * */

    //执行更新操作
    function edit() {
        //判断是否提交空值
        if ($("#AAB996").val() == "") {
            //调用提示框
            $.lightTip.error('投注点数不能为空！请重新输入！', 1000);
            return;
        }
        if ($("#AAB996old").val() === $("#AAB996").val()) {
            $.lightTip.error('未修改点数，无法更新！', 1000);
            return;
        }
        executeSaveOrUpdate({
            formId: "#formDialog form",
            dialogId: "#formDialog",
            url: getUrl("edit"),
            tableId: "#gridTable",
            successMessage: "保存修改成功",
           // successFunc:updateAAB999("aab999-kexuan"),
            // successTitle: '更新对话框',
            //failMessage: '保存修改失败',
            failTitle: '消息对话框'
        });




    }

    //查询
    $("#searchs-btn").click(function () {
        var  bab002=$("#bab002").val();//课程名称
        var  bab006=$("#bab006").val();//导师
        var  bab004=$("#bab004 option:selected").val();//教室地点
        var  bab009=$("#bab009").val();//学分
        var  bab007=$("#bab007 option:selected").val();
        var  bab008=$("#bab008 option:selected").val();
        var params={'bab002': bab002,'bab006':bab006,'bab004':bab004,'bab009':bab009,'bab007':bab007,'bab008':bab008};//传参

        query(params);
    });

    function query(params) {
        var postData = appendPostDataJson("#gridTable", params);
        seachJqgirdData("#gridTable",postData);
    }

   /* //是否退课
    function backCourse(){
        console.log(2121212);
        alert("确认退掉该门课程");
    }
*/



    function backCourse() {
        executeSaveOrUpdate({
            formId: "#formDialog form",
            dialogId: "#formDialog",
            url: getUrl("backCourse"),
            tableId: "#gridTable",
            successMessage: "保存修改成功",
            // successTitle: '更新对话框',
            //failMessage: '保存修改失败',
            failTitle: '消息对话框'
        });
       // updateAAB999("aab999-kexuan");
    }


    //显示查询对话框
    /*var queryDialog = $("#queryDialog");
    $("#query").click(function() {
        showDialog({
            dialogTitle: '查询对话框',
            dialogBody: queryDialog,
            dialogFoot: "<button type='button' class='btn btn-primary' onclick='query()'>查询</button>" +
            "<button type='button' class='btn btn-pink' onclick='reset()'>重置</button>" +
            "<button type='button' class='btn btn-default' data-dismiss='modal'>关闭</button>"
        });
    });

    //具体查询方法
    function query() {
        seachJqgird("#gridTable","#formDialog form");
        $("#formDialog").modal('hide');
    }

    //更新操作
    $("#edit").click(function() {
        showEditView();
    });





    //删除
    $("#delete").click(function() {
        showDeleteView();
    });

    //显示删除对话框

    //显示创建对话框
    $("#create").click(function(){
        loadDialog({
            dialogTitle: '创建对话框',
            dialogUrl: getUrl("create"),
            dialogFoot: '<button type="button" class="btn btn-primary" onclick="create()">添加</button>' +
            '<button type="button" class="btn btn-pink" onclick="reset()">重置</button>' +
            '<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>'
        });
    });

    //保存数据
    function create() {
        executeSaveOrUpdate({
            formId: "#formDialog form",
            dialogId: "#formDialog",
            url: getUrl("create"),
            tableId: "#gridTable",
            successMessage: "保存成功",
            successTitle: '保存对话框',
            failMessage: '保存失败',
            failTitle: '消息对话框'
        });
    }*/
</script>

</body>
</html>